@import '../index.less';

.carousel {
    .element;
    width: auto;
    height: 150px;
    overflow: hidden;

    .el-image {
        width: 100%;
        height: 100%;
        border-radius: inherit;
        pointer-events: none;

        .picture-image-slot {
            display: flex;
            justify-content: center;
            align-items: center;
            width: 100%;
            height: 100%;
            color: #909399;
            font-size: 14px;
            border-radius: inherit;

            &.no-image {
                background-color: #f5f7fa;
                border: 1px solid #DCDFE6;
                box-sizing: border-box;
            }
        }
    }

    .carousel-col {
        overflow: hidden;
        width: auto;
        height: 100%;

        .carousel-col-item {
            position: relative;
            height: 100%;
            width: 100% !important;

            .carousel-indicators {
                position: absolute;
                line-height: 10px;
                height: 10px;
                width: 100%;
                bottom: 10px;
                padding: 0 10px;
                // z-index: 1;
                text-align: center;
                box-sizing: border-box;

                .active {
                    background-color: #9fa5bb;
                }

                li {
                    display: inline-block;
                    width: 5px;
                    height: 5px;
                    background-color: rgba(159, 165, 187, 0.5);
                    border-radius: 5px;
                    margin: 5px 2px;
                    cursor: pointer;
                }
            }

            .carousel-inner {
                position: relative;
                width: 100%;
                height: 100%;
                overflow: hidden;
            }

            .no-data {
                display: flex;
                justify-content: center;
                align-items: center;
                width: 100%;
                height: 100%;
                color: #909399;
                font-size: 14px;
                background-color: #f5f7fa;
                border: 1px solid #DCDFE6;
                box-sizing: border-box;
            }
        }
    }

    .carousel-item {
        width: 100%;
        height: 100%;

        .text-center {
            position: relative;
            height: 100%;
            width: 100%;
            -webkit-transition: .6s ease-in-out left;
            -o-transition: .6s ease-in-out left;
            transition: .6s ease-in-out left;
        }
    }
}